<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script src="jquery-1.9.1.min.js" type="text/javascript"></script>
  <script>
	$(document).ready(function() {
		//json方式的面向对象
		/**var bar = {
			init: function(name, value) {
				this.name = name;
				this.value = value;
			},
			add: function() {
				alert("add"+this.name);
			}
		}

		bar.init("a");
		bar.add();**/

		////////////////////////////////////

		//面向对象的继承
		function Widget(name) {
			this.name = name;
		}

		Widget.prototype.create = function() {
			alert("创建widget");
		}
		Widget.prototype.add = function() {
			alert("添加widget");
		}

		//子类的继承
		function Bar(name, value) {
			//调用父类的构造函数
			Widget.call(this, name);

			this.value = value;
		}

		//继承父类方法,利用Object.create复制父类的属性，避免因为地址指针，覆盖父类方法
		Bar.prototype = Object.create(Widget.prototype);
		//添加自己的方法
		Bar.prototype.setValue = function() {
			alert("设置bar的值"+ this.value);
		}


		//测试
		var Bar = new Bar("柱状", 20);
		Bar.create();
		Bar.add();
		Bar.setValue();


	});
  </script>
 </head>
 <body>
  
  <div id="column">
	
  </div>


 </body>
</html>
